<template>
  <div class="contentLayout">
    <path-tracking :path='path' />

    <div class="formLayout">
      <formList 
        ref="formList"
      />
      <custom-tag 
        ref="customTag"
        title='客户标签'
        :hasScore='false'
      />

      <div class="tableTitle">
          <div class="tableIcon"></div>
          <div class="tableText">备注：</div>
      </div>
      <div class="bgBox">
          <div style="padding: 0 2rem;">
              <el-input type='textarea' rows="5" style="width: 100%;resize: none;" v-model="remarks" maxlength="500" />
          </div>
      </div>

      <div class="formBtnList">
        <button class="sureBtn" @click="toSure">确定</button>
        <button class="cancelBtn" @click="toJumpReplace">取消</button>
      </div>
    </div>
  </div>

</template>
<script>
import pathTracking from '@/components/common/pathTracking'
import formList from './formList'
import customTag from './customerTag'
import { DRcookie } from '@/assets/js/common.js'

export default {
  name: 'toAppoint',
  components:{
    formList,
    pathTracking,
    customTag
  },
  data(){
    return {
      path: ['CRM', '客户管理', {label: '客户列表', name: 'customerList'}, '转预约'],
      remarks:'',
      //phone:'',
      //customerInfoVO:{},
      id:''
    }
  },
  methods:{
    toJump(){
      this.$router.replace({name:'customerList'})
    },
    // 获取部门
    getDep() {
      let department = DRcookie.get('department')
      if(department) {
          return `${department}`
      }else {
          return ''
      }
    },
    //新建预约
    toSure(){
      let basicInfo = this.$refs.formList.getResult();
      let tags = this.$refs.customTag.getResult();
      if(!basicInfo || !tags) {
        return
      }
      var obj = {
        source:'CRM-手动创建',
        promotionSource: this.getDep(),
        area:basicInfo.area,
        shop:basicInfo.shop,
        shopCode:basicInfo.shopCode,
        name:basicInfo.name,
        phone:basicInfo.phone,
        sex:basicInfo.sex,
        email:basicInfo.email,
        address:basicInfo.address,
        detailedAddress:basicInfo.detailedAddress,
        reservationDate:basicInfo.reservationDate,
        reservationStartTime:basicInfo.reservationStartTime,
        reservationEndTime:basicInfo.reservationEndTime,
        planBuyTime:basicInfo.planBuyTime,
        systemTagCategoryVO:tags,
        // remarks:this.remarks,
        type:1,
        status:4,
        isDeal:0
      }
      // 备注
      let remark = {
          content: this.remarks, 
          type: 1
      }
      if(!/^[ ]*$/.test(this.remarks)) {
        obj.followUpRecords = [remark]
      }
      var that = this;
			that.$ajax({
        //url:that.apiCrm +'/reservationInfo/add',
				url:api.crm + '/reservationInfo/add',
				method:'POST',
				data:obj,
			}).then((res) => {
        if(res.data.status == 200){
          that.$message({
              message: '创建预约成功',
              type: 'success'
          });
          setTimeout(function(){
            that.toJumpReplace()
          },3000);
        }else{
          that.$message({
              message: '创建预约失败',
              type: 'warning'
          });
        }
      }).catch((err) => {
         console.log('失败了',err)
      })
    },

    //获取填充数据
    getAppointInfo(id){
      var that = this;
      that.$ajax({
        method:'GET',
        url: api.crm + '/customerInfo/getTransferReservation/'+ id,
      }).then((res) => {
        var data = res.data;
        if(data.status == 200){
          if(res.data.result.reservationInfo == null){//没有预约信息的话  取客户信息
            that.$refs.formList.dispatchData(res.data.result.customerInfo) 
            that.$refs.customTag.dispatchData(res.data.result.customerInfo)
          }else{
            that.$refs.formList.dispatchData(res.data.result.reservationInfo)
            //that.$refs.customTag.dispatchData(res.data.result.reservationInfo)
          }
          
        }
      })
    },
    toJumpReplace(){
      this.$router.replace({name:'customerList'});
    }
  },

  created(){
    this.id = this.$route.query.id;
    this.getAppointInfo(this.id)
  },
  watch:{
		$route:{
			handler(newValue,oldValue){
        if(newValue.name == 'toAppointment'){
          this.getAppointInfo(newValue.query.id)
        }		
			}
		}
	}
  
}
</script>

<style >
@import '../../components/css/viewCommon.css';

</style>

<style scoped>
.formLayout{
    margin: 16px;
    background-color: #fff;
    overflow: auto;
    padding:0 0 24px 0 ;
    border-radius: 8px;
}
</style>
